<div id="languages" style="margin-top: 5px">
</div>
<div class="row">
    <div class="col-md-6">
        <label class="user_label user_languages_margin_left">Language <abbr title="Required"
                                                                            class="user_required">*</abbr></label>
        <input type="text" id="language" class="form-control user_languages_language_box"/>
    </div>
    <div class="col-md-6">
        <label class="user_label">Proficiency</label><br/>
        <select id="proficiency" class="form-control user_select_box" style="width: 230px">
            <option value selected="selected" style="text-align: center">Proficiency..</option>
            <option value="1">Elementary proficiency</option>
            <option value="2">Limited working proficiency</option>
            <option value="3">Professional working proficiency</option>
            <option value="4">Full professional proficiency</option>
            <option value="5">Native or bilingual proficiency</option>
        </select>
    </div>
</div>
<div class="user_languages_margin_left">
    <button id="add-language" class="glyphicon glyphicon-plus btn btn-info user_languages_button"></button>
    <label>Add another language</label>
</div>
<div class="user_languages_margin_left">
    <button class="btn btn-primary" style="margin-top: 5px; width: 70px">Save</button>
    <button class="btn btn-default" style="margin: 5px 0px 0px 5px; width: 70px">Cancel</button>
</div>

<div class="template" id="template-language">
    <div class="row">
        <div class="col-md-6">
            <input type="text" class="form-control user_languages_language_box" value="{ language }"/>
        </div>
        <div class="col-md-6">
            <select class="form-control user_select_box" style="width: 230px">
                <option value selected="selected" style="text-align: center">Proficiency..</option>
                <option value="1">Elementary proficiency</option>
                <option value="2">Limited working proficiency</option>
                <option value="3">Professional working proficiency</option>
                <option value="4">Full professional proficiency</option>
                <option value="5">Native or bilingual proficiency</option>
            </select>
            <span class="glyphicon glyphicon-remove user_languages_remove_sign"></span>
        </div>
    </div>
</div>

<script src="<?php echo $this->basePath() ?>/js/widget/languages.js"></script>